<template>
  <div>
    <div>分配权限功能</div>
    <el-tree
      :data="permissinonlist"
      :props="defaultProps"
      show-checkbox
      default-expand-all
      check-strictly
     ref="tree"
        node-key="id"
    />
    <el-row class="footer" type="flex" justify="center">
      <el-col :span="12">
        <el-button size="small" @click="cancelButton">取 消</el-button>
        <el-button size="small" type="primary" @click="setRolesBtn" >确 定</el-button
        >
      </el-col>
    </el-row>
  </div>
</template>
<script>
export default {
  props: {
    //所有权限点的数据
    permissinonlist: {
      type: Array,
      default: () => [],
    },
    //此角色现有的ID点数组
    permIds: {
      type: Array,
      default: () => [],
    },
  },
  watch:{
    permIds(){
        // console.log('woshi');
        
     this.$refs.tree.setCheckedKeys(this.permIds)
 
    },
  },
  name: "AssignPermission",
  data() {
    return {
      defaultProps: {
        children: "children",
        label: "name",
      },
    };
  },

  methods: {
    // 取消按钮
    cancelButton() {
      this.$emit("close");
    },

    // 设置权限按钮
    setRolesBtn() {
        //获取现在已经选的key值对应的数组
                                 
        const hhh=this.$refs.tree.getCheckedKeys()
        //    console.log(hhh);
      this.$emit("enter",hhh);
    },
  },
};
</script>